<%--
  Created by IntelliJ IDEA.
  User: 王一同
  Date: 2021/11/20
  Time: 12:45
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>审核信息</title>
</head>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/layui/layui/css/layui.css"/>
<script src="${pageContext.request.contextPath}/layui/layui/layui.js"></script>
<script type="text/html" id="toolbarDemo">
    <div class="layui-container">
        <button class="layui-btn layui-btn-sm" lay-event="reload">刷新表格</button>
    </div>
</script>
<body style="margin-top: 40px">
<div class="demoTable layui-form" style="margin-top: 10px; margin-left: 260px">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">采购人：</label>
            <div class="layui-input-inline">
                <input type="text" name="pname" id="pname" placeholder="请输入采购人的姓名" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">审核人：</label>
            <div class="layui-input-inline">
                <input type="text" name="ename" id="ename" placeholder="请输入审核人的姓名" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
    </div>

<%--    <div class="layui-form-item" id="beginEndTime">--%>
<%--        <div class="layui-inline">--%>
<%--            <label class="layui-form-label">开始时间</label>--%>
<%--            <div class="layui-input-inline">--%>
<%--                <input type="date" name="beginTime" id="beginTime" placeholder="请输入采购的开始时间"--%>
<%--                       autocomplete="off" class="layui-input">--%>
<%--            </div>--%>
<%--        </div>--%>

<%--        <div class="layui-inline">--%>
<%--            <label class="layui-form-label">结束时间</label>--%>
<%--            <div class="layui-input-inline">--%>
<%--                <input type="date" name="endTime" id="endTime" placeholder="请输入采购的结束时间"--%>
<%--                       autocomplete="off" class="layui-input">--%>
<%--            </div>--%>
<%--        </div>--%>

<%--    </div>--%>


    <div class="layui-form-item" style="padding-left: 160px">
        <div class="layui-input-block">
            <button type="button" class="layui-btn" lay-submit="" id="serachBtn">搜索</button>
            <button type="reset" class="layui-btn layui-btn-primary" id="reset">重置</button>
        </div>
    </div>
</div>


<table class="layui-hide" id="purchaseTab" lay-filter="test"></table>
<div hidden id="tempTabel" style="text-align: center">
    <div style="width: 690px" class="layui-inline">
        <table class="layui-hide" id="purchaseDetailTab" lay-filter="test"></table>
    </div>
    <div class="layui-row " style="height: 43px;background-color: #eee;">
        <div class="layui-col-md4" style="line-height: 43px ;font-weight: bold">
            采购人: <span id="cgPeople"></span>
        </div>
        <div class="layui-col-md4"style="line-height: 43px;font-weight: bold">
            总金额: <span id="cgPrice"></span>
        </div>
        <div class="layui-col-md4"style="line-height: 43px;font-weight: bold">
            时间: <span id="cgDate"></span>
        </div>
    </div>


    <script type="text/html" id="barDemo">
        {{#     if(d.status==0){  }}

        <button type="button" class="layui-btn   layui-btn-sm layui-btn-normal " lay-event="edit">查看详情</button>
        <a class="layui-btn layui-btn-normal layui-btn-sm" lay-event="pass">通过</a>
        <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="reject">驳回</a>
        {{#  }else if(d.status==1||d.status==2){  }}

        <button type="button" class="layui-btn   layui-btn-sm layui-btn-normal " lay-event="edit">查看详情</button>
        {{#  }else{  }}

        <button type="button" class="layui-btn   layui-btn-sm layui-btn-normal " lay-event="edit">查看详情</button>
        {{#      }      }}

    </script>
</div>
</body>
<script>
    //js方式获取本地时间+1天
    Date.prototype.toLocaleStringTomorrow = function() {
        var dateTime=new Date();
        dateTime=dateTime.setDate(dateTime.getDate()+1);
        dateTime=new Date(dateTime);
        var y = dateTime.getFullYear();
        var m = dateTime.getMonth()+1;
        m = m<10?'0'+m:m;
        var d = dateTime.getDate();
        d = d<10?("0"+d):d;
        return y+"-"+m+"-"+d;
    }

    layui.use(['table', 'jquery', 'form'], function () {
        var table = layui.table;
        var $ = layui.jquery;
        var form = layui.form;
        var tomorrowTime = (new Date()).toLocaleStringTomorrow();

        // 封装年月日时分秒的函数
        function dat() {
            return tomorrowTime;
        }

        //校验时间不能超过当前系统时间  并且结束时间不能小于开始时间
        $("#beginEndTime input").change(function () {
            var beginTime = $("#beginTime").val();
            var endTime = $("#endTime").val();
            //判断输入的开始日期或者结束时间要小于当前系统时间
            if (beginTime != "") {
                if (beginTime > dat()) {
                    layer.msg("开始时间不能大于当前日期", {icon: 5})
                    $("#beginTime").val("");
                }
            }

            if (endTime != "") {
                if (endTime > dat()) {
                    layer.msg("结束时间不能大于当前日期", {icon: 5})
                    $("#endTime").val("");
                }
            }
            //判断输入的开始日期要小于结束时间
            if (beginTime!=""&&endTime!="") {
                if (beginTime > endTime) {
                    layer.msg("开始时间不能大于结束时间", {icon: 5})
                    $("#beginTime").val("");
                    $("#endTime").val("");
                }
            }

        })

        //加载页面就调用展示动态表格
        select();
        //查询全部的采购订单表（拥有权限）
        function select() {
            var tableReload = table.render({
                elem: '#purchaseTab'
                , url: '${pageContext.request.contextPath}/purchase/selectAllPurchaseCheck' //数据接口
                , page: true
                , limit: 5
                , limits: [3, 4, 5, 6]
                //设置唯一id
                , id: "temp"
                , toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
                , cols: [[ //表头
                    {type: 'checkbox', fixed: 'left', align: 'center'}
                    , {type: 'numbers', title: '序号', align: 'center'}
                    , {field: 'pname', title: '采购人姓名', align: 'center', width: 100}
                    , {field: 'pdate', title: '采购日期', align: 'center', width: 200}
                    , {field: 'totalCount', title: '总数量', align: 'center', width: 100}
                    , {field: 'totalPrice', title: '总金额', align: 'center', width: 100}
                    , {field: 'ename', title: '审核人姓名', align: 'center', width: 100}
                    , {field: 'edate', title: '审核人日期', align: 'center', width: 200}

                    , {
                        field: 'status', title: '审批状态', align: 'center', templet: function (d) {
                            if (d.status == 0) {
                                return '<button class="layui-btn layui-btn-warm layui-btn-radius layui-btn-sm">待审批</button>'
                            } else if (d.status == 1) {
                                return '<button class="layui-btn layui-btn-danger layui-btn-radius layui-btn-sm">审批驳回</button>'
                            } else if (d.status == 2 || d.status==3) {
                                return '<button class="layui-btn layui-btn-normal layui-btn-radius layui-btn-sm">审批通过</button>'
                            } else if (d.status == 4) {
                                return '<button class="layui-btn layui-btn-danger layui-btn-radius layui-btn-sm">入库驳回</button>'
                            }
                        }
                    }
                    //当前行  模板元素选择器
                    , {fixed: 'right', title: '操作', toolbar: '#barDemo', align: 'center', width: 270}
                ]]
            });
        }

        //查询动态表格全部数据
        var datas = [];
        table.render({
            elem: '#purchaseDetailTab'
            // , data: datas
            , page: true
            , limit: 8
            , limits: [8, 12, 18]
            , id: "temp1"
            , cols: [[
                {field: 'id', title: 'ID', width: 80, align: 'center'}
                , {field: 'bookname', title: '图书名称', width: 150, align: 'center'}
                , {field: 'author', title: '作者', width: 150, align: 'center'}
                , {field: 'booktype', title: '图书类型', width: 137, align: 'center'}
                , {field: 'count', title: '数量', width: 80, align: 'center'}
                , {field: 'price', title: '进价', width: 83, align: 'center'}
            ]]
        });

        //头工具栏事件
        table.on('toolbar(test)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            switch (obj.event) {
                //    点击刷新表格
                case 'reload':
                    //调用查询列表的方法
                    select();
                    break;
            };
        });


        //监听行工具事件    查看详情
        table.on('tool(test)', function (obj) {
            var data = obj.data;
            if (obj.event === 'edit') {
                //把当前的pid传到后台进行查询采购详情信息
                $.ajax({
                    url: '${pageContext.request.contextPath}/purchase/getpurchaseDetailMassage',
                    dataType: "json",
                    type: "post",
                    data: {pid: data.pid},
                    //同步
                    async: false,
                    success: function (purDetObj) {
                        datas = [];
                        //循环把数组中的数据放入datas
                        for (let i = 0; i < purDetObj.length; i++) {
                            datas.push(purDetObj[i])
                        }
                        //重载表格把json类型的数据给data
                        table.reload('temp1', {
                            data: datas
                        });
                        //回显 采购人 总金额  采购时间
                        $("#cgPeople").text(data.pname)
                        $("#cgPrice").text(data.totalPrice)
                        $("#cgDate").text(data.pdate)
                        layer.open({
                            type: 1
                            , title: '采购详情信息'
                            , content: $("#tempTabel")
                            , area: '800px'
                        });
                    }
                })
                //    点击通过按钮时
            } else if (obj.event === 'pass') {
                $.ajax({
                    url: '/purchase/updateStatusPass',
                    dataType: "json",
                    type: "post",
                    data: {status: 2, pid: data.pid},
                    success: function (StatusObj) {
                        if (StatusObj.code == 200) {
                            layer.msg(StatusObj.msg, {icon: 1});
                            //加载表格
                            select()
                        } else {
                            layer.msg(StatusObj.msg, {icon: 5});
                        }
                    }
                })
                //    点击驳回按钮
            } else if (obj.event === 'reject') {
                layer.prompt({
                    formType: 2
                    , title: '驳回理由'

                }, function (value, index) {
                    $.ajax({
                        url: '/purchase/updateStatusReject',
                        dataType: "json",
                        type: "post",
                        //value代表当前文本框的内容
                        data: {status: 1, pid: data.pid, rejectReason: value,totalCount:data.totalCount,totalPrice:data.totalPrice,pdate:data.pdate,pname:data.pname,uid:data.uid},
                        success: function (StatusObj) {
                            if (StatusObj.code == 200) {
                                layer.msg(StatusObj.msg, {icon: 1});
                                //加载表格
                                select()
                            } else {
                                layer.msg(StatusObj.msg, {icon: 5});
                            }
                        }
                    })
                    layer.close(index);
                });


            }
        });




        //搜索框
        $("#serachBtn").on("click", function () {
            /*  alert($("#pname").val())
              alert($("#ename").val())
              alert($("#beginTime").val())
              alert($("#endTime").val())*/
            //执行重载
            // temp数据表格id
            table.reload('temp', {
                page: {
                    curr: 1 //重新从第 1 页开始
                }
                , where: {
                    pname: $("#pname").val(),
                    ename: $("#ename").val(),
                    beginTime: $("#beginTime").val(),
                    endTime: $("#endTime").val(),
                }
            });
        })
        //点击重置是刷新页面
        $("#reset").click(function () {
            $("#pname").val(""),
                $("#ename").val(""),
                $("#beginTime").val(""),
                $("#endTime").val("")
            select();
        })


    })
</script>
</html>
